<!-- <div class="app-footer">
    <span class="download-map" title="download map" >
        <i class="fa fa-cloud-download" (click)="downloadMap()" aria-hidden="true"></i>
      </span>
  <span class="coordinates-text">
    <i class="fa fa-map-marker" aria-hidden="true" title="Coordinates"></i>
    {{Coordinates?(Coordinates.x|number:'1.1-5'):''}}{{Coordinates?'，':''}}{{Coordinates?(Coordinates.y|number:'1.1-5'):''}}
  </span>
  <span class="unit-text" [title]="Unit">
    <strong>Unit: </strong>{{Unit}}
  </span>
  <span class="crs-text"  >
    <!-- all projection 
    <app-projection-list [class.show]="ShowSwitchProjectionFlag"></app-projection-list>
    <i class="fa fa-globe" aria-hidden="true"></i>
    <span  title="CRS Name" class="noselect" (click)="switchProjection()"> {{CrsName}}</span>
  </span>

  <span class="loading">
      <nz-spin [nzSize]="'small'"></nz-spin>
  </span>
</div> -->
<div class="app-footer">
  <div >
    <div class="State">
      <img *ngIf="StateShowFlag"  src="assets/images/common/loading2.gif" alt="">
      <span class="state-text" [title]="StateInfo">{{StateInfo}}</span>
    </div>

    <div class="Coordinates" >
      <span>
        <i class="fa fa-map-marker" aria-hidden="true" title="Coordinates"></i>
        {{Coordinates?(Coordinates.x|number:'1.1-5'):''}}{{Coordinates?'，':''}}{{Coordinates?(Coordinates.y|number:'1.1-5'):''}}
      </span>
    </div>
  </div>
</div>